<template>
  <div class="recommend">
      <div class="recommend-item" v-for="(item,index) in recommends" :key="index">
      <a :href="item.link">
          <img :src="item.image" alt="">
          <div>{{item.title}}</div>
      </a>
      </div>
  </div>
</template>

<script>
export default {
    props:{
        recommends:{
            type: Array,
            default(){
                return []
            }
        }
    }

}
</script>

<style>
.recommend{
    display: flex;
    width: 100%;
    text-align: center;
    font-size: 12px;
    padding: 15px 0 30px;
    /* 设置下边框样式 */
    border-bottom: 8px solid #eea;
    
}

.recommend-item{
    flex:1;
}

/* 给图片设置大小 */
.recommend-item  img{
    width: 65px;
    height: 65px;
}
</style>